<template>
    <div>
        <h2 style="text-align:center">修改密码</h2>
        <van-form @submit="onSubmit" >
            <van-field
            v-model="username"
            name="username"
            label="用户名"
            placeholder="用户名"
            :rules="rules.username"
            />
        <van-field
            v-model="password"
            type="password"
            name="password"
            label="旧密码"
            placeholder="旧密码"
            :rules="rules.password"
            />
        <van-field
                v-model="setpass"
                type="password"
                name="setpass"
                label="新密码"
                placeholder="请输入新密码"
                :rules="rules.setpass"
            />
        <van-field
                v-model="repass"
                type="password"
                name="repass"
                label="确认新密码"
                placeholder="确认新密码"
                :rules="rules.repass"
            />
        <div style="margin: 16px;">
        <van-button round block type="info" native-type="submit">提交</van-button>
        </div>
        </van-form>
    </div>
</template>

<script>
import Vue from 'vue';
import { Form } from 'vant';
import { Field } from 'vant';
import {repassword} from '@/request'
import { Toast } from 'vant';
import {setcookie} from '@/utils/cookie'

Vue.use(Form);
Vue.use(Field);
Vue.use(Toast);
export default {
    data () {
        return {
            rules: {
                username: [
                {
                required: true,
                message: '请填写用户名' ,
                trigger: 'onChange'
                }
                ],
                password: [
                {
                required: true,
                message: '请输入密码' ,
                trigger: 'onChange'
                }
                ],
                setpass:[
                {
                    required: true,
                    message: '新密码必填'
                },
                {
                pattern: /^.{6,12}$/,
                message: '长度在6~12位'
                },
                ],
                repass:[
                {
                 required: true,
                 message: '确认新密码必填'
                },
                {
                validator: this.validator,
                message: '两次密码输入不一致'
                }
                ]
            },
            username: '',
            password: '',
            setpass:'',
            repass:'',
            }
        },
        methods:{
            onSubmit(values) {
                var _this=this
                //delete values.setpass
                //delete values.repass
                repassword(values).then(data=>{
                    var {code,msg}=data
                    if(code===0){
                        Toast.fail(msg);
                    }else if(code===2){
                        Toast.fail(msg);
                    }
                    else if(code===1){
                        Toast.success({
                            message:msg,
                            onClose(){
                                _this.$router.push('login')
                            }
                        });
                    }
                })
           },
        validator(val) {
            // 在这里进行验证，返回true表示通过，返回false表示不通过
            return this.setpass === this.repass
                }
        }
}
</script>

<style scoped>

</style>